<style scoped lang='less'>
@import "./index.less";
</style>

<template>
    <div class='user'>
        <user-form @change="onUserInfoChange" />
        <user-card :info="user" />
    </div>
</template>

<script lang="ts" setup>
import { ref } from "vue";
import { UserForm, UserCard } from "./components/index";
import { IUserInfo } from "@/types";

const user = ref<IUserInfo>({
    userName: "",
    school: "",
    baseInfo: {
        address: "",
        tel: "",
        email: "",
        birthday: "",
    },
    education: [],
})

const onUserInfoChange = (e: IUserInfo)=>user.value = e;
</script>